<!--
 * @Author: hua
 * @Date: 2020-12-24 20:35:35
 * @description: 
 * @LastEditors: hua
 * @LastEditTime: 2021-01-03 13:36:09
-->
<template>
  <div>
    <video id="remotevideo" autoplay  style="  height: 100%;
  width: 100%;
  position: relative;
  z-index:1;"/>
    <video id="localvideo" autoplay/>
  </div>
</template>

<script>
const {ipcRenderer} = require('electron');
import { mapGetters } from "vuex";
import { joinChatSend } from "@/socketIoApi/chat";
import { chatSend } from "@/socketIoApi/chat";
import { send } from "@/utils/socketio";
import {init, startDesktopVideo, agreeStartDesktopVideo,startVideo, agreeStartVideo,  onOffer, onAnswer, onCandidate, stop, stopVideo, hangUp} from "@/utils/webRtc.js"
export default {
    data() {
        return {
      
        }
    },
    computed: {
      ...mapGetters([
        "videoType",
        "currentRoomUuid",
        "currentRoomSaveAction",
        "currentRoomType",
        "CHAT_VIDEO",
        "LOCAL"
      ]),
    },
    destroyed() {
      chatSend({
        data: {
          msg: JSON.stringify({ type: "end" }),
          room_uuid: this.currentRoomUuid,
          type: this.CHAT_VIDEO,
          save_action: this.LOCAL
        }
      });
      stopVideo();
      hangUp();
      send("leave", { room_uuid: this.currentRoomUuid });
    },
    mounted() {
      const {ipcRenderer} = require('electron')
      //ipcRenderer.send('send-message-B', 'someData');
      ipcRenderer.on('send-message-B-reply', (event, arg) => {
        // switch(arg.action){
        //   case 'onOffer':
        //     onOffer(arg.evt);
        //     break;
        //   case 'onAnswer':
        //     onAnswer(arg.evt);
        //     break;
        //   case 'onCandidate':
        //     onCandidate(arg.evt);
        //     break;
        //   case 'stop':
        //     stop();
        //     break;
        //   case 'end':
        //     stopVideo();
        //     hangUp();
        //     break;
        // }
      });
      joinChatSend({
          name: "",
          room_uuid: this.currentRoomUuid,
          type: this.currentRoomType,
          save_action: this.currentRoomSaveAction
        }).then(res => {
        if(this.videoType == 0) {
          init();
          startVideo();
        } else if(this.videoType == 1) {
          init();
          agreeStartVideo();
        }else if(this.videoType == 2) {
          init();
          startDesktopVideo();
        }
        else if(this.videoType == 3) {
          init();
          agreeStartDesktopVideo();
        }
      })
    }
}
</script>

<style>
#localvideo{
  height:30%;
  width: 30%;
  position: absolute;
  z-index:2;
  top:32px;
  left:0px;
}
</style>